<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>插入多行文本框</title>
        <script type="text/javascript" src="../internal.js"></script>
        <link rel="stylesheet" href="../../../bootstrap/bootstrap.css">
        <link rel="stylesheet" href="../../../bootstrap/bootstrap-responsive.css">
        <style type="text/css">
            *{color: #838383;margin: 0;padding: 0}
            html,body {font-size: 12px;overflow: hidden; }
            body {
                padding-left: 20px;padding-right: 20px;width:400px;
            }
        </style>
    </head>
    <body>
        <table class="table table-striped table-bordered" style="margin-top:18px;margin-bottom: 0;">
            <tr>
                <th><span>控件名称</span><span class="label label-important">*</span></th>
                <th><span>字体大小</span> </th>
            </tr>
            <tr>
                <td> <input id="areaName" type="text" placeholder="必填项" size="20" /> </td>
                <td> <input id="areaFontSize" type="text" size="20" value="12" /> </td>
            </tr>
            <tr>
                <th><span>输入框样式</span> </th>
                <th><span>增强</span> </th>
            </tr>
            <tr>
                <td> 宽： <input id="areaWidth" value="300" type="text" size="3" /> 高 ： <input id="areaHeight" value="80" type="text" size="3" /></td>
                <td> <label><input id="richText" type="checkbox"  /> 富文本形式 </label> </td>
            </tr>
            <tr>
                <td colspan="2">
                    <textarea style="width:440px;height: 64px;" id="areaContent" placeholder="输入框默认值..."></textarea>
                </td>
            </tr>
        </table>
        <script type="text/javascript">
            var oNode = null;
            window.onload = function() {
                //弹出窗口初始化函数，这里主要是判断是编辑多行文本框还是新增
                //以下这个对象定义在editor.all.js第13325行。
                if( UE.plugins['textarea'].editdom ){
                    oNode = UE.plugins['textarea'].editdom;
                    $G('areaName').value = oNode.getAttribute('title');
                    $G('areaContent').value = oNode.getAttribute('value');
                    var nRich = oNode.getAttribute('rich');
                    if ( nRich == '1' ) {
                        $G('richText').checked = true ;
                    } else {
                        nRich = '0';
                    }
                    var sFontSize = oNode.style.fontSize;
                    $G('areaFontSize').value = sFontSize.substr(0, sFontSize.length - 2);//这里的substr是为了去掉末尾的'px'
                    var sSizeWidth = oNode.style.width;
                    $G('areaWidth').value = sSizeWidth.substr(0, sSizeWidth.length - 2);
                    var sSizeHeight = oNode.style.height;
                    $G('areaHeight').value = sSizeHeight.substr(0, sSizeHeight.length - 2);
                }
            }
            dialog.oncancel = function () {
                if( UE.plugins['textarea'].editdom ) {
                    delete UE.plugins['textarea'].editdom;
                }
            };
            dialog.onok = function (){
                if($G('areaName').value==''){
                    alert('请输入控件名称');
                    return false;
                }
                if( !oNode ) {
                    var sUrl =  parent.getItemUrl;
                    var nItemId = null;
                    ajax.request(sUrl, {timeout:60000,onsuccess:function (xhr) {
                            try {
                                nItemId = xhr.responseText;
                                var html = '<textarea ';
                                html += ' title = "' + $G('areaName').value + '"';
                                html += ' name = "data_' + nItemId + '"';
                                html += ' value = "' + $G('areaContent').value + '"';
                                if ( $G('richText').checked ) {
                                    html += ' rich = "1"';
                                    if( $G('areaWidth').value != '' ) {
                                        html += ' rich_width = "' + $G('areaWidth').value + '"';
                                    } else {
                                        html += ' rich_width = ""';
                                    }
                                    if( $G('areaHeight').value != '' ) {
                                        html += ' rich_height = "' + $G('areaHeight').value + '"';
                                    } else {
                                        html += ' rich_height = ""';
                                    }
                                } else {
                                    html += ' rich = "0"';
                                }
                                html += ' style = "';
                                if( $G('areaFontSize').value != '' ) {
                                    html += 'font-size:' + $G('areaFontSize').value + 'px;';
                                }
                                if( $G('areaWidth').value != '' ) {
                                    html += 'width:' + $G('areaWidth').value + 'px;';
                                }
                                if( $G('areaHeight').value != '' ) {
                                    html += 'height:' + $G('areaHeight').value + 'px;';
                                }
                                html += '">';
                                html += $G('areaContent').value + '</textarea>';
                                editor.execCommand('insertHtml',html);
                            } catch (e) {
                                return;
                            }
                        },
                        error:function () {
                            alert('Request TimeOut');
                        }
                    })
                } else {
                    oNode.setAttribute('title', $G('areaName').value);
                    oNode.setAttribute('value',$G('areaContent').value);
                    oNode.innerHTML = $G('areaContent').value;
                    if( $G('richText').checked ) {
                        oNode.setAttribute('rich', 1);
                    } else {
                        oNode.setAttribute('rich', 0);
                    }
                    var style = '';
                    if( $G('areaFontSize').value != '' ) {
                        style += 'font-size:' + $G('areaFontSize').value + 'px;';
                    }
                    if( $G('areaWidth').value != '' ) {
                        style += 'width:' + $G('areaWidth').value + 'px;';
                        if( $G('richText').checked ) {
                            oNode.setAttribute('rich_width', $G('areaWidth').value);
                        }
                    } else {
                        if( $G('richText').checked ) {
                            oNode.setAttribute('rich_width', '');
                        }
                    }
                    if( $G('areaHeight').value != '' ) {
                        style += 'height:' + $G('areaHeight').value + 'px;';
                        if( $G('richText').checked ) {
                            oNode.setAttribute('rich_height', $G('areaHeight').value);
                        }
                    } else {
                        if( $G('richText').checked ) {
                            oNode.setAttribute('rich_height', '');
                        }
                    }
                    oNode.setAttribute('style',style );
                    delete UE.plugins['textarea'].editdom; //使用后清空这个对象，变回新增模式
                }
            };
        </script>
    </body>
</html>
